//index.js
//获取应用实例
const app = getApp()

Page({
  data: {
    showModal0: false, // 显示modal弹窗
    showModal1: false, // 显示modal弹窗
    showModal2: false, // 显示modal弹窗
    bg:'ffffff',
    fg:'000000',
    gc:'000000',
    rpxRatio: 1, //此值为你的屏幕CSS像素宽度/750，单位rpx实际像素
    single: true, // false 只显示一个按钮，如果想显示两个改为true即可
    a:'',//文本内容
    scene:'',//二维码生成链接
    colorData0: {
      //基础色相，即左侧色盘右上顶点的颜色，由右侧的色相条控制
      hueData: {
        colorStopRed: 255,
        colorStopGreen: 0,
        colorStopBlue: 0,
      },
      //选择点的信息（左侧色盘上的小圆点，即你选择的颜色）
      pickerData: {
        x: 0, //选择点x轴偏移量
        y: 480, //选择点y轴偏移量
        red: 0,
        green: 0,
        blue: 0,
        hex: '#000000'
      },
      //色相控制条的位置
      barY: 0
      
    },
    colorData1: {
      //基础色相，即左侧色盘右上顶点的颜色，由右侧的色相条控制
      hueData: {
        colorStopRed: 255,
        colorStopGreen: 0,
        colorStopBlue: 0,
      },
      //选择点的信息（左侧色盘上的小圆点，即你选择的颜色）
      pickerData: {
        x: 0, //选择点x轴偏移量
        y: 480, //选择点y轴偏移量
        red: 0,
        green: 0,
        blue: 0,
        hex: '#000000'
      },
      //色相控制条的位置
      barY: 0
    },
    colorData2: {
      //基础色相，即左侧色盘右上顶点的颜色，由右侧的色相条控制
      hueData: {
        colorStopRed: 255,
        colorStopGreen: 0,
        colorStopBlue: 0,
      },
      //选择点的信息（左侧色盘上的小圆点，即你选择的颜色）
      pickerData: {
        x: 0, //选择点x轴偏移量
        y: 480, //选择点y轴偏移量
        red: 0,
        green: 0,
        blue: 0,
        hex: '#000000'
      },
      //色相控制条的位置
      barY: 0
    }
  },
    onChangeColor(e) {
      //这里我使用了dataset来存储标志，用来判断时哪个拾色器发生变化
      const index = e.target.dataset.id
      this.setData({
        [`colorData${index}`]: e.detail.colorData
      })
      let reg = new RegExp("#", "g");
      let bg = this.data.colorData0.pickerData.hex.replace(reg, "");
      let fg = this.data.colorData1.pickerData.hex.replace(reg, "");
      let gc = this.data.colorData2.pickerData.hex.replace(reg, "");
      this.setData({
        bg: bg,
        fg: fg,
        gc: gc,
      })
      this.textlInput()
    },
  bgFun0:function(){
    this.setData({
      showModal0:true
    })
  },
  bgFun1: function () {
    this.setData({
      showModal1: true
    })
  },
  bgFun2: function () {
    this.setData({
      showModal2: true
    })
  },
  
  // 点击取消按钮的回调函数
  modalCancel(e) {
    // 这里面处理点击取消按钮业务逻辑
    console.log('点击了取消')
  },
  // 点击确定按钮的回调函数
  modalConfirm(e) {
    // 这里面处理点击确定按钮业务逻辑
    console.log('点击了确定')
  },
  //生成二维码
  textlInput: function (e) {
    if(e!=null){
      let end = e.detail.value.replace(/&/g, "%26");
      this.setData({
        a: end,
        scene: 'http://qr.liantu.com/api.php?' + '&bg=' + this.data.bg + '&fg=' + this.data.fg + '&gc=' + this.data.gc + '&text=' + this.data.a
      });
    }else{
      this.setData({
        scene: 'http://qr.liantu.com/api.php?' + '&bg=' + this.data.bg + '&fg=' + this.data.fg + '&gc=' + this.data.gc + '&text=' + this.data.a
      })
    }
    console.log(this.data.scene)
    
  },
  //保存图片
  previewImage: function (e) {
    wx.previewImage({
      urls: this.data.scene.split(',')
      // 需要预览的图片http链接  使用split把字符串转数组。不然会报错
    })
  },
  
  onLoad() {
    var that = this;
    //设置rpxRatio
    wx.getSystemInfo({
      success(res) {
        that.setData({
          rpxRatio: res.screenWidth / 640
        })
      }
    })
  },
})
